<template>
  <div class="content-card">
    <div>
      <Card :bordered="false" dis-hover>
        <div slot="title" style="padding-top:10px;">
          <span class="title" style="font-size:16px;">申请/发布记录</span>
          <span class="btn">
            <i-button style="color:#00A573">发布融资需求</i-button>
          </span>
        </div>
        <div>
          <div class="check-radio">
            <Radio-group v-model="radio" type="button" @on-change="checkChange">
              <Radio :label="0">贷款产品申请</Radio>
              <Radio :label="1">融资需求发布</Radio>
            </Radio-group>
          </div>
        </div>


          <div class="marginT20">
            <i-form :model="formItem" :label-width="80">
              <Row>
                <i-col  v-if="radio==0" span="6" offset="1">
                  <Form-item label="产品名称" :label-width="85">
                    <i-select
                      v-model="formItem.productId"
                      placeholder="请选择"
                      style="display:inline-block;width:170px"
                    >
                      <i-option v-for="item in productList" :key="item.productId" :value="item.productId">{{item.productName}}</i-option>
                    </i-select>
                  </Form-item>
                </i-col>
                <!-- <i-col span="6" offset="1">
                  <Form-item label="企业名称" :label-width="90">
                    <i-select
                      :model.sync="formItem.select"
                      placeholder="请选择"
                      style="display:inline-block;width:170px"
                    >
                      <i-option value="beijing">北京市</i-option>
                      <i-option value="shanghai">上海市</i-option>
                      <i-option value="shenzhen">深圳市</i-option>
                    </i-select>
                  </Form-item>
                </i-col> -->
                <i-col span="6" offset="1">
                  <Form-item label="状态" :label-width="70">
                    <i-select
                      v-model="formItem.auditStatus"
                      placeholder="请选择"
                      style="display:inline-block;width:170px"
                    >
                      <i-option value="0">待审核</i-option>
                      <i-option value="1">尽调中</i-option>
                      <i-option value="2">审核驳回</i-option>
                      <i-option value="3">已放款</i-option>
                      <i-option value="4">已撤回</i-option>
                      <i-option value="5">未读(已选)</i-option>
                      <i-option value="6">已删除</i-option>
                    </i-select>
                  </Form-item>
                </i-col>
                <i-col span="2"  offset="2">
                  <Form-item>
                    <i-button @click="search" type="success">查询</i-button>
                  </Form-item>
                </i-col>
              </Row>
            </i-form>
          </div>









        <div v-show="radio==0">
          <!-- <div style="text-align:center">
            <i-button type="success">查询</i-button>
          </div> -->
          <div class="marginT20">
            <i-table :columns="columns1" :data="data1">
              <template slot-scope="{ row, index }" slot="action">
                <!-- <Button type="success" size="small" @click="detail(index)">查看</Button> -->
                <span class="cursor-point" style="color:#00A573" @click="detail(index)">查看</span>
              </template>
            </i-table>
          </div>
        </div>

        <div v-show="radio==1">
          <!-- <div class="marginT20">
            <i-form :model="formItem" :label-width="80">
              <Row>
                <i-col span="6" offset="1">
                  <Form-item label="产品名称" :label-width="85">
                    <i-select
                      :model.sync="formItem.parductId"
                      placeholder="请选择"
                      style="display:inline-block;width:170px"
                    >
                      <i-option value="beijing">北京市</i-option>
                      <i-option value="shanghai">上海市</i-option>
                      <i-option value="shenzhen">深圳市</i-option>
                    </i-select>
                  </Form-item>
                </i-col>
                <i-col span="6" offset="1">
                  <Form-item label="状态" :label-width="90">
                    <i-select
                      :model.sync="formItem.select"
                      placeholder="请选择"
                      style="display:inline-block;width:170px"
                    >
                      <i-option value="0">待审核</i-option>
                      <i-option value="1">尽调中</i-option>
                      <i-option value="2">审核驳回</i-option>
                      <i-option value="3">已放款</i-option>
                      <i-option value="4">已撤回</i-option>
                      <i-option value="5">未读(已选)</i-option>
                      <i-option value="6">已删除</i-option>
                    </i-select>
                  </Form-item>
                </i-col>
                <i-col span="6" offset="3">
                  <i-button type="success">查询</i-button>
                </i-col>
              </Row>
            </i-form>
          </div> -->
          <div class="marginT10" v-for="item in data2" :key="item.applyId" @click="detail">
            <div class="financing-list">
              <p>
                <span style="font-size:18px;font-weight:700">{{item.entName}}</span>
                <span style="display:inline-block;margin-left:10px">{{item.applyTime}}</span>
              </p>
              <Row class="marginT10">
                <i-col span="2">
                  <span>当前状态</span>
                </i-col>
                <i-col span="2">
                  <span class="weight700">尽调中</span>
                </i-col>
                <i-col span="2">
                  <span class="bank-desc">工商银行</span>
                </i-col>
              </Row>
              <Row class="marginT10">
                <i-col span="2" offset="2">
                  <span class="weight700">审核驳回</span>
                </i-col>
                <i-col span="2">
                  <span class="bank-desc">交通银行</span>
                </i-col>
              </Row>
              <Row class="marginT10">
                <i-col span="2" offset="2">
                  <span class="weight700">已放款</span>
                </i-col>
                <i-col span="8">
                  <span class="bank-desc">工商银行</span>
                  <span class="bank-desc">中国工商银行河北分行</span>
                </i-col>
              </Row>
              <Row class="marginT10">
                <i-col span="2">
                  <span>需求描述</span>
                </i-col>
                <i-col span="20">
                  <span class="weight700">{{item.applyDetail}}</span>
                </i-col>
              </Row>
            </div>
          </div>
        </div>

        <div class="marginT20">
          <Row class="marginT20">
            <i-col span="14" offset="10">
              <Page @on-change='pageChange' :current='currentPage' :total="total" show-elevator />
            </i-col>
          </Row>
        </div>
      </Card>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      radio: 0,
      formItem: {
        applyPhone:this.$token.getUUID(),
        productId: "",
        demandType:0,
        auditStatus:null
      },
      productList:[],
      columns1: [
        {
          title: "序号",
          align: "center",
          key: "a"
        },
        {
          title: "企业名称",
          align: "center",
          key: "entName"
        },
        {
          title: "金融机构",
          align: "center",
          key: "longName",
          width: 120
        },
        {
          title: "产品名称",
          align: "center",
          key: "productName"
        },
        {
          title: "期待融资金额",
          align: "center",
          key: "loanAmount",
          width: 120
        },
        {
          title: "状态",
          align: "center",
          key: "auditStatus"
        },
        {
          title: "操作",
          key: "g",
          align: "center",
          slot: "action"
        }
      ],
      data1: [],
      data2:[],
      isA: 1,
      total:null,
      currentPage:1
    };
  },
  mounted(){
    this.getProdectList()
    this.getMyProduct()
  },
  methods: {
    pageChange(num){
      this.currentPage=num
      this.getMyProduct()
    },
    search(){
      console.log(this.formItem)
      this.getMyProduct()
    },
    getProdectList(){
      this.$axios('myApplygetProducts',[],{
        userPhone:this.$token.getUUID()
      }).then(res=>{
        console.log(res)
        this.productList=res.data.result
      })
    },
    getMyProduct(){
      this.$axios('myApplygetFinanals',this.currentPage+'/10'+'?'+this.$QS.stringify(this.formItem),{}).then(res=>{
        console.log(res)
        if(this.radio==0){
          this.data1=res.data.result
          this.total=res.data.listSize
        }else{
          this.data2=res.data.result
          this.total=res.data.listSize
        }
      })
    },
    detail() {
      this.$router.push({
        path: "/personalCenterUnDirectionalDetail"
      });
    },
    checkChange(idx) {
      console.log(this.currentPage)
      this.radio = idx;
      this.formItem.demandType=idx;
      this.currentPage=1
      this.getMyProduct()
    }
  }
};
</script>

<style scoped>
.btn {
  display: inline-block;
  margin-left: 15px;
  margin-top: -10px;
  vertical-align: middle;
}
.financing-list {
  border: 1px solid #ccc;
  padding: 20px;
}
.bank-desc {
  display: inline-block;
  padding: 2px;
  background: #ccc;
  color: #00a573;
  border-radius: 5px;
  font-size: 12px;
  margin-left: 10px;
  margin-top: -5px;
}
</style>